<!--
 * @Description:
 * @Author: william
 * @Date: 2025-02-05 09:08:10
 * @LastEditors: william
 * @LastEditTime: 2025-03-11 18:38:12
-->
<template>
  <el-dropdown
    trigger="click"
    class="tooltip-dropdown-wrap"
    @command="handleSetLanguage"
  >
    <div class="svg-wrap right-menu-item">
      <svg-icon class-name="svg-icon" icon-class="language" />
    </div>
    <template #dropdown>
      <el-dropdown-menu>
        <el-dropdown-item :disabled="language === 'zh'" command="zh">
          {{ $t('public.chinese') }}
        </el-dropdown-item>
        <el-dropdown-item :disabled="language === 'en'" command="en">
          {{ $t('public.english') }}
        </el-dropdown-item>
      </el-dropdown-menu>
    </template>
  </el-dropdown>
</template>

<script setup>
const appStore = useAppStore()
const { language } = storeToRefs(appStore)
const { locale } = useI18n()
const handleSetLanguage = lang => {
  appStore.setLanguage(lang)
  locale.value = lang
  // window.location.reload()
}
</script>
